<% cache('feature_anniversary-banner', skip_digest: true) do %>
  <%= feature('anniversary-banner') %>
<% end %>

<!-- facilitate space for multi-line header -->
<% if !current_user %>
  <%= stylesheet_link_tag "I18n" %>
<% end %>

<nav id="header" class="navbar navbar-expand-md navbar-dark bg-dark fixed-top">
    <!-- ||| menu, displayed for mobile: -->
  <a data-toggle="tooltip" title="Home" data-placement="bottom" class="navbar-brand ml-lg-5" id="brand" href="<%= root_path %>">Public Lab</a>
  <button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#header-navbar-collapse">
    <span class="fa fa-bars fa-white"></span>
  </button>

    <div class="collapse navbar-collapse" id="header-navbar-collapse">
      <form class="form-inline mr-3" id="searchform" autocomplete="off">
        <div class="input-group">
          <input aria-label="Enter Search Query" type="text" id="searchform_input" class="form-control search-query typeahead" role="search" qryType="tags" placeholder="<%= translation('layout._header.search', {}, false) %>"  value="<%= params[:query] %>" required>
          <div class="input-group-append">
            <button class="btn btn-light" type="submit" title="Search button" aria-label="Search Button"><i class="fa fa-search"></i></button>
          </div>
        </div>
      </form>

      <ul class="navbar-nav mr-auto">

        <% cache('feature_navbar', skip_digest: true) do %>
          <%= feature('navbar') %>
        <% end %>

        <li class="nav-item dropdown" style="min-width:80px;">
          <div class="nav-link" data-toggle="dropdown" onclick="location.href='#">
            <%= translation('layout._header.community.community_title') %>
          </div>  
          <div class="dropdown-menu">
            <% if current_user&.has_tag('translation-helper') && I18n.locale != :en %>
              <div class="dropdown-item">
                <a class="text-body" href="/getting-started"><b><%= translation('layout._header.community.get_started') %> &raquo;</b></a>
              </div>
            <% else %>
              <a class="dropdown-item" href="/getting-started"><b><%= translation('layout._header.community.get_started') %> &raquo;</b></a>
            <% end %>
              <div class="dropdown-divider"></div>
              <%= create_nav_dropdown_item("/people","layout._header.community.people") %>
              <%= create_nav_dropdown_item("/map","layout._header.community.places") %>
              <%= create_nav_dropdown_item("/projects","layout._header.community.projects") %>
              <%= create_nav_dropdown_item("/events","layout._header.community.events") %>
              <%= create_nav_dropdown_item("/questions","layout._header.community.questions") %>
              <%= create_nav_dropdown_item("/chat","layout._header.community.chat") %>
          </div>
        </li>

        <li class="nav-item dropdown" style="min-width:80px;">
          
            <div class="nav-link" data-toggle="dropdown" onclick="location.href='#">
            <%= translation('layout._header.tools.tools_title') %>
            </div>
          
          <div class="dropdown-menu">
            <% if current_user&.has_tag('translation-helper') && I18n.locale != :en %>
              <div class="nav-link dropdown-item">
                <a class="text-body" href="/methods"><%= translation('layout._header.tools.methods') %></a>
              </div>
            <% else %>
                <a class="dropdown-item" href="/methods"><%= translation('layout._header.tools.methods') %></a>
            <% end %>
              
              <div class="dropdown-divider"></div>
              <h6 class="dropdown-header"><%= translation('layout._header.tools.kits') %></h6>
              <%= create_nav_dropdown_item("/kits","layout._header.tools.kits_initiative") %>
              <%= create_nav_dropdown_item("//store.publiclab.org","layout._header.tools.store") %>
              <h6 class="dropdown-header"><%= translation('layout._header.tools.software') %></h6>
              <%= create_nav_dropdown_item("//mapknitter.org","layout._header.tools.map_knitter") %>
              <%= create_nav_dropdown_item("//infragram.org","layout._header.tools.infragram") %>
              <%= create_nav_dropdown_item("//spectralworkbench.org","layout._header.tools.spectral_workbench") %>
              <%= create_nav_dropdown_item("//code.publiclab.org#r=all","layout._header.tools.code_community") %>
          </div>
        </li>

        <li class="nav-item dropdown about" style="min-width:80px;">
          <div class="nav-link" data-toggle="dropdown" onclick="location.href='#'">
            <!-- <a > -->
            <%= t('layout._header.about.about_title') %>
            <!-- </a> -->
          </div>
          <div class="dropdown-menu">
              <%= create_nav_dropdown_item("/about","layout._header.about.about_public_lab") %>
              <%= create_nav_dropdown_item("/blog","layout._header.about.blog") %>
              <%= create_nav_dropdown_item("/newsletter","layout._header.about.newsletter") %>
              <%= create_nav_dropdown_item("/public-lab-careers","layout._header.about.careers") %>
              <%= create_nav_dropdown_item("/wiki/contact","layout._header.about.contact") %>
          </div>
        </li>

        <li class="nav-item d-md-none d-lg-inline store" style="padding:0 10px;">
          <a class="nav-link btn btn-outline-secondary" target="_blank" href="//store.publiclab.org"><%= t('layout._header.store') %></a>
        </li>
        <li class="nav-item d-md-none d-lg-inline donate" style="padding:0 10px;">
          <a class="nav-link btn btn-outline-secondary" href="/donate"><%= t('layout._header.donate') %></a>
        </li>

        <!-- end navbar feature -->

      </ul>

      <ul class="navbar-nav mr-lg-5">
        <% if current_user %>
          <li class="nav-item d-sm-none d-xl-inline">
            <a rel="tooltip" class="nav-link" title="<%= t('layout._header.your_dashboard') %>" data-placement="bottom" href="/dashboard"><%= translation('layout._header.dashboard') %></a>
          </li>
        <% else %>
        <li class="d-md-none d-xl-inline nav-item"> <!-- signup button -->
          <a rel="tooltip" class="nav-link <% unless current_page?('/signup') %> signupToggle <% end %>" title="<%= t('layout._header.become_part_community') %>" href="#">
            <%= t('layout._header.join') %>
          </a>
        </li>
        <% end %>

        <% unless params[:action] == "register" || params[:action] == "signup" %>
            <% if current_user %>
            <li class="nav-item dropdown">
              <a class="nav-link" data-toggle="dropdown" href="#">
              	<div class="profile-icon">
                  <% if current_user.profile_image == "https://www.gravatar.com/avatar/eb721d116a28f4a4da4ea67340c8ce75" %>
                    <i class="fa fa-user-circle fa-lg" style="color:white;"></i>
                  <% else %>
                    <img src="<%= current_user.profile_image %>" class="rounded-circle" style="width:20px; height:20px; margin-right:8px;" alt="profile-photo" id="profile-photo" />
                  <% end %>
                </div>
              </a>
              <div class="dropdown-menu dropdown-menu-right">
                  <h5 class="dropdown-header">
                    <%= current_user.username %>
                    <% if logged_in_as(['admin', 'moderator']) %>
                       - logged in as <%= current_user.role %>
                    <% end %>
                  </h5>
                  <% if current_user&.has_tag('translation-helper') && I18n.locale != :en %>
                    <div class="dropdown-item">
                      <a class="text-body" href="/profile/<%= current_user.username %>"><%= translation('layout._header.profile') %></a>
                    </div>
                  <% else %>
                    <a class="dropdown-item" href="/profile/<%= current_user.username %>"><%= translation('layout._header.profile') %></a>
                  <% end %>
                    <%= create_nav_dropdown_item("/profile/edit","layout._header.edit_profile") %>
                    <%= create_nav_dropdown_item("/settings","Notification Settings") %>
                    <div class="dropdown-divider"></div>
                    <%= create_nav_dropdown_item("/subscriptions","layout._header.subscriptions") %>
                    <% if current_user&.has_tag('translation-helper') && I18n.locale != :en %>
                    <div class="dropdown-item">
                      <a class="text-body" href="/profile/<%= current_user.username %>/likes"><%= translation('layout._header.notes_liked') %></a>
                    </div>
                  <% else %>
                    <a class="dropdown-item" href="/profile/<%= current_user.username %>/likes"><%= translation('layout._header.notes_liked') %></a>
                  <% end %>
                    <div class="dropdown-divider"></div>
                      <% if logged_in_as(['admin']) %>
                      <a class="dropdown-item" href="/useremail">Email search</a>
                      <a class="dropdown-item" href="/wiki/locked">Locked pages</a>
                      <a class="dropdown-item" href="/spam">Spam moderation</a>
                      <a class="dropdown-item" href="/people"><%= translation('sidebar._related.contributors') %></a>
                      <a class="dropdown-item" href="/features"><%= translation('layout._header.features') %></a>
                      <div class="dropdown-divider"></div>
                      <% end %>

                      <% if Rails.env==="development" %> 
                          <% if current_user %>
                              <% if current_user&.has_tag('translation-helper') %>
                                  <a rel="tooltip" class="dropdown-item" data-placement="bottom" data-method="delete" href="/profile/tags/delete/<%= current_user.id %>?name=translation-helper&translationswitch=yes">
                                        Switch off Translation
                                  </a>        
                              <% else %>
                                  <a rel="tooltip" class="dropdown-item" data-placement="bottom" data-method="post" href="/profile/tags/create/<%= current_user.id %>?translationswitch=yes&name=translation-helper">
                                      Switch on Translation
                                  </a>
                              <% end %>
                            <div class="dropdown-divider"></div>
                          <% end %>
                      <% end %>
                      
                      <% if current_user&.has_tag('translation-helper') && I18n.locale != :en %>
                      <div class="dropdown-item">
                      <%= link_to translation('layout._header.logout'), logout_path, class: "text-body" %>
                      </div>
                      <% else %>
                        <%= link_to translation('layout._header.logout'), logout_path, class: "dropdown-item" %>
                      <% end %>
                    <a class="dropdown-item" href="/logoutRemotely">Logout from all devices</a>
                  </div>
              </li>
            <% else %> <!-- Login button -->
                <li class="nav-item">
                    <a class="nav-link <% unless current_page?('/login') %> loginToggle <% end %>" href="#">
                    <%= t('layout._header.login.login_title') %>
                    </a>
                </li>
            <% end %>
          <% end %>
        </li>
        <li id="md-ham" class="d-lg-none dropdown">
          <a href="#" class="btn" data-toggle="dropdown"><span class="fa fa-bars fa-white" style="vertical-align: middle;"></span></a>
          <div class="dropdown-menu dropdown-menu-right">
            <a class="dropdown-item d-lg-none" href="//store.publiclab.org"><%= translation('layout._header.store') %></a>
            <a class="dropdown-item d-lg-none"  href="/donate"><%= translation('layout._header.donate') %></a>
            <!--These menu items will only appear in the "More" dropdown menu. -->
            <% if current_user %>
              <a class="dropdown-item d-xl-none" rel="tooltip" title="<%= translation('layout._header.your_dashboard',{},false) %>" data-placement="bottom" href="/dashboard"><%= translation('layout._header.dashboard') %></a>
            <% else %>
              <a class="dropdown-item d-xl-none" rel="tooltip" title="<%= translation('layout._header.become_part_community',{},false) %>" href="/signup"><%= translation('layout._header.join') %></a>
            <% end %>
          </div>
        </li>
    </div>
</nav>

<div class="body-container container">
  <div class="visible-print">
    <% if params[:controller] == "notes" %><h1>Public Lab <small><%= t('layout._header.research_note') %></small></h1><% end %>
    <% if params[:controller] == "wiki" %><h1>Public Lab <small><%= t('layout._header.wiki_doc') %></small></h1><% end %>
    <hr />
  </div>
  <script>
      $('#chat-button').click(function(e){
              e.stopPropagation() ;
      });
      $('body').click(function(){
          var c = $('#chat') ;
          if($('#chat').is(':visible') == true)
            c.hide() ;
      });
      $('.nav-item.dropdown').on('show.bs.dropdown', function () {
        $('.nav-item.dropdown').addClass('no-hover');
      });
      $('.nav-item.dropdown').on('hide.bs.dropdown', function () {
        $('.nav-item.dropdown').removeClass('no-hover');
      });
  </script>
  <%= render partial: "layouts/alerts" %>
</div>

<%= render partial: "layouts/signupLoginModal" %>

  <script type="text/javascript" src="/lib/leaflet-environmental-layers/lib/glify.js"></script>


<style>
  .profile-icon{
      cursor:pointer;
  }

  .profile-icon:hover .fa-user-circle:before{
      opacity:0.5;
  }
  @media (max-width: 767px){
    .navbar{
      max-height: 100vh;
      overflow-y: auto;
      -webkit-overflow-scrolling:touch;
    }
    .store{
      margin-bottom:5px;
    }
  }
  @media (min-width:768px){
    .about{
      margin-left:-25px;
    }
    .store{
      width:90px;
    }
    .donate{
      width:90px;
    }
  }
 
</style>

<%= render :partial => "map/mapDependencies" %>
